'use strict'
import React, {createClass} from 'react'
import $ from 'jquery'

const GoodBoard = createClass({
    render() {
        const { data, setExchangeModalData } = this.props;
        if (data) {
            return (
                <ul className="good-list grid-view">
                    {
                        data.map(function(item, idx) {
                            let liClass = 'good-item',
                                boundClick = () => {
                                setExchangeModalData(item);
                                $('#exchangeModal').modal('show');
                            };
                            if(item.class) {
                                liClass += ' ' + item.class;
                            }
                            return (<li className={liClass} key={idx} onClick={boundClick}>
                                <div className="item-inner">
                                    <div className="good-cover">
                                        <div className="box-holder"></div>
                                        <img src={item.img_url} />
                                    </div>
                                    <h3 className="good-title">{item.title}</h3>
                                    <div><span className="good-price">{item.points}</span></div>
                                </div>
                            </li>);
                        })
                    }
                </ul>
            );
        }
        else {
            return <div className="text-center">暂无数据</div>;
        }
    }
});

export default GoodBoard;